<style>
#memberModel .modal-header h3{display:inline-block}
#memberModel .caption h3{margin:0;line-height:24px}
#memberModel .thumbnail img{width:128px; height:128px;float:left}
#memberModel .caption {margin-left:143px;height:110px;position:relative}
#memberModel .caption .current-level{position: absolute;right: 0;top: 0;}
#memberModel .thumbnails li{margin:0 0 15px 0;width: 100%;}
#memberModel .thumbnails li:last-child{margin-bottom:0}
#memberModel .tip{height:100px; line-height:100px; text-align:center}
#memberModel .description{height: 70px;line-height: 17px;}
#memberModel .modal-body{padding-bottom:5px}
</style>
<script src="__CDN__/js/address.js"></script>
<div id="memberModel" class="list-1 modal hide fade product-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <h3 id="myModalLabel">搜索代理</h3>
  	<form class="search-box">
		<input type="text" name="mobile" maxlength="11" style="width: 130px;" placeholder="请输入代理手机号">
		<button type="submit" class="btn btn-default"><i class="icon-search"></i></button>
	</form>
  </div>
  <div class="modal-body">
  	<div class="tip">请输入手机号搜索会员</div>
	<div class="row-fluid hide">
         <ul class="thumbnails"></ul>
       </div>
  </div>
  <div class="modal-footer">
    <button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">关闭</button>
  </div>
</div>
<script type="text/javascript">

(function(){   
	var $modal = $('#memberModel')
	   ,$form = $modal.find('.search-box')
	   ,$mobile = $form.find('input')
	   ,tel = /^1[3|4|5|7|8]\d{9}$/
	   ,$listContainer = $modal.find('.row-fluid')
	   ,$thumbnails = $listContainer.find('.thumbnails')
	   ,$tip = $modal.find('.tip');
	$modal.modal();
	
	$form.on('submit', function(){
		var mobile = $mobile.val();
		if(!tel.test(mobile)){
			return alertMsg('请输入11位手机号'), false;
		}
		
		$.ajax({
			url: '/admin/level/search?mobile=' + mobile,
			dataType: 'json',
			success: function(list){
				if(list.length == 0){
					$tip.html('手机号不存在').show();
					$listContainer.addClass('hide');
					return;
				}
				
				$tip.hide();
				$listContainer.removeClass('hide');
				
				var html = description = area = '';
				for(var i=0; i<list.length; i++){
					area = '未知城市';
					if(list[i].province_id){
						area = Address.get(list[i].province_id);
						if(list[i].city_id){
							area = Address.get(list[i].province_id);
							if(list[i].county_id){
								area += ' ' + Address.get(list[i].county_id);
							}
						}
					}
					
					var wxs = list[i].wxs;
					for(var j=0; j<wxs.length; j++){
						description += '<div title="'+wxs[j].nickname+'">' + wxs[j].last_login + '最后登录“'+wxs[j].app_name+'”</div>';
					}
					
					html += '<li><div class="thumbnail">';
					html += '   <img src="'+list[i]['wxs'][0].headimgurl+'">';
					html += '   <div class="caption">';
					html += '	  <span class="label label-warning current-level">'+list[i].agent_title+'</span>';
					html += '     <h3>'+list[i].nick+ '<span style="font-size:14px"> - ' + area + '</span></h3>';
					html += '     <div class="description">'+description+'</div>';
					html += '     <div data-mid="'+list[i].id+'">';
					
					var agents = list[i].agents;
					for(var j=0; j<agents.length; j++){
						html += ' <button class="js-action btn btn-mini '+(agents[j].disabled ? '" disabled="disabled' : 'btn-primary')+'" data-level="'+agents[j].level+'">'+agents[j].title+'</button>';
					}
					
					html += '     </div>';
					html += '   </div>';
					html += '</div></li>';
				}
				$thumbnails.html(html);
			}
		});
		return false;
	});
	
	$modal.on('click', '.js-action', function(){
		var $btn = $(this);
		if(!confirm('确定调为【'+$btn.text()+'】吗？')){
			return false;
		}
		
		var postObj = {mid: $btn.parent().data('mid'), level: $btn.data('level')}; 
		
		$.ajax({
			url: '__ACTION__',
			type: 'post',
			dataType: 'json',
			data: postObj,
			success: function(){
				$modal.modal('hide');
				$('#table').gridView('refresh');
			}
		});
		return false;
	})
})();
</script>